<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="UTF-8">
    <meta name="ctx" th:content="${#httpServletRequest.getContextPath()}"/>
    <title>登录</title>
    <link rel="stylesheet" th:href="@{/css/admin/base-v2.css}">
    <link rel="stylesheet" th:href="@{/lib/font-awesome/4.7.0/css/font-awesome.min.css}">
    <link rel="stylesheet" th:href="@{/css/admin/app.css}">
</head>

<body>
<div class="app-login">
    <div class="container">
        <div class="header">
            <h1 class="title">后台登录</h1>
        </div>
        <form class="login-form">
            <div class="form-item col">
                <label class="label">账号</label>
                <div class="body">
                    <input type="text" placeholder="请输入账号" name="userName" data-name="账号" data-rule="required">

                </div>
            </div>
            <div class="form-item col">
                <label class="label">密码</label>
                <div class="body">
                    <input type="password" placeholder="请输入密码" name="password" data-name="密码" data-rule="required">

                </div>
            </div>
            <div class="form-msg"></div>
            <div class="form-column z-btn-row">
                <a class="btn-sub z-btn z-btn-l z-primary">登录</a>
            </div>
        </form>
    </div>
</div>

<script th:src="@{/lib/jquery.min.js}"></script>
<script th:src="@{/js/form.js}"></script>
<script th:src="@{/js/popup.js}"></script>
<script type="text/javascript" th:inline="javascript">
    //java web session过期 跳转登录页面，怎么跳出iframe的问题
    if (top.location != location){
        top.location.href = location.href;
    }
    //获取context path
    var context = $("meta[name='ctx']").attr("content") || '';

    var form = $(".login-form").form({
        msg: function (msg) {
            popup.tips(msg)
        },
        submit: function () {
            var data = {}
            $.each($(".login-form").serializeArray(), function (index, field) {
                data[field.name] = field.value;
            })
            $.ajax({
                type: "POST",
                url: context + "/web/doLogin",
                data: data,
                success: function (obj) {
                    var code = obj.code;
                    if (code == 0) {
                        popup.tipsTop('登录成功', 'success');
                        setTimeout(function (args) {
                            //跳转到首页
                            window.location.href = context + "/web/goIndex";
                        }, 500);
                    } else {
                        popup.tipsTop(obj.msg, 'warning');
                    }
                }
            })
        }
    })
</script>
</body>

</html>